<template>
      <div id="menber">
            <page-title><span slot="pageName">{{ UserInfo.username }}商家会员管理</span></page-title>
            <div class="table_box">
                  <el-table
                  :data="tableData"
                  style="width: 100%"
                  border
                  stripe
                  align="center"
                  :row-class-name="tableRowClassName">
                        <el-table-column
                              prop="id"
                              align="center"
                              label="会员ID"
                              >
                        </el-table-column>
                        <el-table-column
                              prop="username"
                              align="center"
                              label="姓名"
                              >
                        </el-table-column>
                        <el-table-column
                              prop="birthday"
                              align="center"
                              label="生日">
                        </el-table-column>
                        <el-table-column
                              prop="telephone"
                              align="center"
                              label="手机">
                        </el-table-column>
                        <el-table-column
                              prop="cardnum"
                              align="center"
                              label="卡号">
                              <template slot-scope="scope">
                                   {{ scope.row.cardnum }}  
                              </template>
                        </el-table-column>
                        <el-table-column
                              prop="score"
                              align="center"
                              label="剩余积分">
                              <template slot-scope="scope">
                                   {{ scope.row.score }}  
                              </template>
                        </el-table-column>

                        <el-table-column
                              prop="status"
                              align="center"
                              label="积分记录">
                              <template slot-scope="scope" >
                                    <el-button type="primary" size="mini" @click="ShowScore(scope.row)" >
                                          查看积分记录
                                    </el-button>
                              </template>
                        </el-table-column>

                        <el-table-column prop="cardNum" align="center" label="操作" width="300px">
                              <template slot-scope="scope">
                                    <!-- <el-button
                                    size="mini"
                                    @click="showUser(scope.row.userid)">查看会员</el-button> -->
                                    <el-button
                                    size="mini"
                                    type="danger"
                                    @click="userEdit(scope.row)">会员信息修改</el-button>

                                    <el-button
                                    size="mini"
                                    type="success"
                                    @click="scoreEdit(scope.row)">积分修改</el-button>
                              </template>
                        </el-table-column>
                  </el-table>
            </div>
            <!-- dialog -->
            <score-list :DialogData="DialogData" :ListData="scoreList"></score-list>
            <edit-vip :EditData="EditData" :FormData="FormData" :edit="edit" @update="getUserMenber"></edit-vip>
            <score-edit :ScoreData="ScoreData" :UserData="UserData" @update="getUserMenber"></score-edit>
      </div>
</template>

<script>
import PageTitle from '@/components/PageTitle'
import ScoreList from "@/components/Goods/ScoreList"
import EditVip from "@/components/main/EditVip"
import ScoreEdit from "@/components/main/ScoreEdit"
      export default {
            data() {
                  return {
                        username: "",
                        UserInfo: "",
                        tableData: [],
                        scoreList: [],
                        DialogData: {
                              title: "",
                              show: false
                        },
                        EditData: {
                              show: false
                        },
                        FormData: {},
                        edit: {
                              username: true,
                              birthday: true,
                              address: true,
                              phone: true,
                              cardnum: true,
                              score: true
                        },
                        ScoreData: {
                              show: false,
                              title: ""
                        },
                        UserData: {},
                  }
            },
            components: {
                  PageTitle,
                  ScoreList,
                  EditVip,
                  ScoreEdit
            },
            computed: {
                  userid() {
                        return this.$route.params.userid; 
                  },
                  token() {
                        return localStorage.miniToken;
                  }
            },
            mounted () {
                  this.getUserMenber();
            },
            methods: {
                  //  表格行类
                  tableRowClassName({row, rowIndex}) {
                        if (rowIndex === 1) {
                              return 'warning-row';
                        } else if (rowIndex === 3) {
                              return 'success-row';
                        }
                              return '';
                  },
                  // 获取店主和 会员
                  async getUserMenber() {
                        let res = await this.$axios.post("/admin/user/member", {
                              userid: this.userid,
                              token: this.token
                        })
                        //console.log(res);
                        
                        let data = res.data.data
                        this.UserInfo = data[0]
                        this.tableData = data.children
                    
                        
                  },

                  // 查看积分记录
                  async ShowScore( row ) {
                        let token = localStorage.miniToken
                        let res = await this.$axios.post("/admin/user/memberscore", {
                              token,
                              cardnum: row.cardnum
                        })

                        let data = res.data.data
                        this.scoreList = data
   
                        this.DialogData = {
                              title: `${row.username}的积分记录`,
                              show: true
                        }
                  },
                  //  编辑会员信息
                  userEdit( row ) {
                       //console.log(row);
                        
                        this.EditData = {
                              show: true
                        }
                        this.FormData = {
                              address: row.address,
                              id: row.id,
                              birthday: row.birthday,
                              cardnum: row.cardnum,
                              province: `${row.province}`,
                              city: `${row.city}`,
                              county: `${row.county}`,
                              telephone: row.telephone,
                              score: row.score,
                              username: row.username
                        }
                        this.edit = {
                              username: true,
                              birthday: true,
                              address: true,
                              phone: true,
                              cardnum: true,
                              score: true
                        }
                  },
                  // 积分修改
                  scoreEdit( user ) {
                        //console.log(user);
                        this.ScoreData = {
                              show: true,
                              title: `${user.username} 积分信息更新`
                        }
                        this.UserData = {
                              cardnum: user.cardnum,
                              score: user.score
                        }
                  },
            },
      }
</script>

<style lang="scss" scoped>
   
</style>